.top{    
        height: 220px;
        .grey{
            width: 94%;
            height: 148px;
            background-image: url('https://img01.yzcdn.cn/upload_files/2021/06/17/Fg4i1XSOL7_QLLXNe1vYT7nHUqZU.png!730x0.jpg');
            background-size: 96% 100%;
            padding: 10px;
            position: relative;
            display: flex;
            justify-content: space-between;
            .left{
                
                display: flex;
                justify-content: space-between;
                .img{
                    width: 60px;
                    height: 60px;
                    border-radius: 50%;
                    border: 1px solid #eee;
                    margin-top: 30px;
                    margin-right: 10px;
                }
                .content{
                    margin-top: 6px;
                    .text{
                        font-size:20px;
                        font-weight: bold;
                        color: #fff;
                    }
                    .title{
                        margin-top: 10px;
                        color: #fddda5;
                        font-size: 11px;
                        line-height: 20px;
                        padding: 2px 10px;
                        border: 1px solid #000;
                        border-radius: 15px;
                        background: rgb(65,61,66);
                        
                    }
                } 
            }
            .right{
                display: flex;
                justify-content: space-between;
                margin-top: 10px;
              
                .img{
                    width: 10px;
                    height: 10px;
                    margin-top: 3px;
                }
                view{
                    margin-left: 6px;
                    width: 60px;
                    height: 25px;
                    line-height: 20px;
                    text-align: center;
                    font-size: 12px;
                    color: #fff;
                    height: 20px;
                    background: rgba(0,0,0,.2);
                    border-radius: 10px;
                }
            }
          
        }
        .yello{
            border-radius: 10px;
            width: 87%;
            height: 70px;
            position: absolute;
            top: 30%;
            left: 5%;
            background-image: url('https://img01.yzcdn.cn/public_files/2019/02/20/9a0bb2c59bf55531f2dbfddd2b2ce0da.png');
            display: flex;
            line-height: 70px;
            padding-left: 10px;            
            .left{
                width: 73%;
                font-size: 13px;
                .img{
                    width: 15px;
                    height: 15px;
                }
            }
            .right{
                button{
                    // width: 30%;
                    height: 70px;
                    background: transparent;                    font-size: 13px;
                    padding: 0;
                    line-height: 70px;
                    width: 110%;
                    padding: 0 8px;
                }
            }
        }
    }
 .contents{
        background: #eee;

        padding: 10px 10px 0 10px;
        .books{
            height: 70px;
            background: #fff;
            padding:10px;
            border-radius: 5px;
            display: flex;
            justify-content: space-between;
            .books-item{
                .num{
                    margin: 10px 0 5px 0;
                    text-align: center;
                    font-weight: bold;
                }
                .img{
                    width: 16px;
                    height: 16px;
                }
                .text{
                    color: #666;
                    
                }
            }
        }
        .orders{
            background: #fff;
            padding: 0 10px;
            height: 120px;
            width: 93%;
            height: 110px;
            margin-top: 10px;
            border-radius: 5px;
            .hh{
                display: flex;
                justify-content: space-between;
                .left{
                    font-weight: 600;
                    line-height: 40px;
                    font-size: 15px;
                }
                .right{
                    color: #999;
                    font-size: 13px;
                    line-height: 40px;
                }
                
            }
            .orders_list{
                
                display: flex;
                justify-content: space-between;
               margin:10px 0 ;
                .orders_item{
                    width: 20%;
                    .img{
                        width: 25px;
                        height: 25px; 
                        margin: 0 0 0 20px;
                     }
                     .text{
                         font-size: 11px;
                         line-height: 22px;
                         text-align: center;
                     }
                }
            }
        }
        .tary{
            background: #fff;
            margin-top: 10px;
            padding: 10px;
            border-radius: 5px;
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap;
            .tary_list{
                width: 25%;
                margin: 10px 0;
                .img{
                    width: 25px;
                    height: 25px;
                    margin:0 0 0 24px;
                }
                .text{
                    text-align: center;
                    font-size: 12px;
                }
            }
        }
        .bottom{
            margin-top: 10px;
            border-radius: 5px;
            .bottom_list{
                display: flex;
                justify-content: space-between;
                flex-wrap: wrap;
        
                .bottom_item{
                    background: #fff;
                    width: 48%;
                    margin-bottom: 10px;
                    border-radius: 5px;
                    .img{
                        width: 140px;
                        height: 145px;
                        border-radius: 5px 5px 0 0;
                    }
                    .vview{
                        padding: 0 10px;
                        .text{
                            font-size: 13px;
                            line-height: 20px;
                        }
                        .price{
                            color: red;
                            line-height: 30px;
                        }
                        .title{
                            font-size: 11px;
                            color: red;
                            margin-bottom: 5px;
                        }
                    }
                }
            }
        }

}
.footer{
    background: #eee;
    padding: 20px;
    .top{
        padding: 0px 15px;
        display: flex;
        height: 50px;
        justify-content: space-between;
        .top_list{
                font-size: 11px;
                color: #666;
                line-height: 25px; 
        }
    }
    .bottom{
        margin-left: 30%;
        .img{
            width: 110px;
            height: 35px;
        }
        .text{
            font-size: 13px;
            color: #999;
            .icon{
                font-size: 14px;
            }
        }
    }
}
/* 返回顶部 */

.goTop{

    height: 80rpx;
  
    width: 80rpx;
  
    position: fixed;
  
    bottom: 50rpx;
  
    background: rgba(0,0,0,.3);
  
    right: 30rpx;
  
    border-radius: 50%;
  
  }